import React, { useState, forwardRef, useImperativeHandle, useEffect } from 'react';
import { Modal, Form, Row, Col, Button } from 'antd';
import { connect } from 'umi';
import ShowTable from './components/ShowTable';
import PopImgShow from '@/components/PopImgShow';
import SelectModel from './components/SelelctModel'
const SettingOpeational = (props, ref) => {
  const { onChange, defaultList = [] } = props
  const [list, setList] = useState([])
  const [visible, setVisible] = useState(false)
  useEffect(() => {
    setList(defaultList)
  }, [defaultList])
  useImperativeHandle(ref, () => {
    return {
      getInformationCollection: () => {
        return list.map(item => {
          return item.id
        })
      }
    }
  })
  if (list.length) {
    return (
      <>
        <Row style={{ marginBottom: 24 }}>
          <Col style={{ textAlign: 'right' }} span={6}>
            选择信息采集：
          </Col>
          <Col span={18}>
            <Button
              style={{ marginBottom: 12 }}
              onClick={() => {
                setVisible({ show: true, details: list });
              }}
            >
              修改
            </Button>
          </Col>
          <Col offset={6} span={18}>
            <ShowTable
              setList={setList}
              list={list}
            ></ShowTable>
          </Col>
        </Row>
        <SelectModel onOk={(e) => {
          setList(e)
          onChange(e)
        }} onClose={() => setVisible(false)} visible={visible}></SelectModel>
      </>

    );
  } else {
    return (
      <>
        <Row style={{ marginBottom: 24 }}>
          <Col style={{ textAlign: 'right' }} span={6}>
            选择信息采集：
          </Col>
          <Col gutter={[24, 24]}>
            <Button
              onClick={() => {
                setVisible({ show: true, details: list });
              }}
            >

              +立即选择
            </Button>
          </Col>
        </Row>
        <SelectModel onOk={(e) => {
          setList(e)

        }} onClose={() => setVisible(false)} visible={visible}></SelectModel>
      </>

    );
  }
};

export default forwardRef(SettingOpeational);
